<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="./style/product_list.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>奶茶热卖列表</title>
</head>
<body>
<div id="container" style="background: #F1F3F5">
    <div id="nav">
        奶茶热卖
    </div>
    <ul id="productList">
        <li onclick='jumpDetail(0)'>
            <img alt='' src='imgs/milktea_1.png' />
            <div>
                <p>珍珠奶茶 大杯 三分糖去冰</p>
                <span><span>¥</span> 18</span>
            </div>
        </li>
        <li onclick='jumpDetail(1)'>
            <img alt='' src='imgs/milktea_2.png' />
            <div>
                <p>杨枝甘露 中杯 正常糖少冰</p>
                <span><span>¥</span> 22</span>
            </div>
        </li>
        <li onclick='jumpDetail(2)'>
            <img alt='' src='imgs/milktea_3.png' />
            <div>
                <p>草莓奶盖茶 大杯 七分糖热饮</p>
                <span><span>¥</span> 20</span>
            </div>
        </li>
        <li onclick='jumpDetail(3)'>
            <img alt='' src='imgs/milktea_4.png' />
            <div>
                <p>芋圆烧仙草 超大杯 无糖常温</p>
                <span><span>¥</span> 25</span>
            </div>
        </li>
        <li onclick='jumpDetail(4)'>
            <img alt='' src='imgs/milktea_5.png' />
            <div>
                <p>抹茶拿铁 中杯 半糖少冰</p>
                <span><span>¥</span> 19</span>
            </div>
        </li>
        <li onclick='jumpDetail(5)'>
            <img alt='' src='imgs/milktea_6.png' />
            <div>
                <p>焦糖玛奇朵 大杯 全糖热饮</p>
                <span><span>¥</span> 24</span>
            </div>
        </li>

    </ul>
</div>
<script src="./js/product_list.js"></script>
</body>
</html>